import { Button, Carousel } from "antd"
import { LeftOutlined, RightOutlined } from "@ant-design/icons"
import { AchievementCard } from "@/components/achievementCard"
import ApplyCard from "@/components/applyCard"
import BriefCard from "@/components/briefCard"
import IconCard from "@/components/iconCard"
import LinkPanel from "@/components/linkPanel"
import Swiper from "@/layout/swiper/Swiper"
import React, { useRef } from "react"
import styles from "./index.module.scss"

function Home() {
  const carouselRef = useRef(null)
  const reportList = [
    { icon: "#icon-weibiaoti-2-16", title: "成果形成的背景", path: "/report/bg" },
    { icon: "#icon-weibiaoti-2-18", title: "成果主要内容", path: "/report/content" },
    { icon: "#icon-weibiaoti-2-12", title: "成果的创新点", path: "/report/dot" },
    { icon: "#icon-weibiaoti-2-17", title: "成果的推广应用效果", path: "/report/effect" },
  ]
  const materialList = [
    { icon: "#icon-weibiaoti-2-06", title: "教学成果应用及效果证明材料", path: "/material/evidence" },
    { icon: "#icon-weibiaoti-2-09", title: "理论探索与研究", path: "/material/outcome" },
  ]
  const imageList = [
    {
      id: "02",
      url: require("@/assets/images/image_column/02.png").default,
      title: "我校举行2019级“惟义农学实验班”开班仪式",
      link: "https://www.jxau.edu.cn/44/da/c50a83162/page.htm",
    },
    {
      id: "03",
      url: require("@/assets/images/image_column/03.png").default,
      title: "我校基层党建创新案例荣获第三届全国基层党建最佳案例",
      link: "https://www.jxau.edu.cn/94/e4/c50a38116/page.htm",
    },
    {
      id: "05",
      url: require("@/assets/images/image_column/05.png").default,
      title: "“农民导师”站上高校讲台",
      link: "https://baijiahao.baidu.com/s?id=1730535413265525532&wfr=spider&for=pc",
    },
    {
      id: "06",
      url: require("@/assets/images/image_column/06.png").default,
      title: "上高水稻科技小院获评中国农技协“十佳科技小院”",
      link: "https://www.jxau.edu.cn/81/d9/c50a98777/page.htm",
    },
    {
      id: "07",
      url: require("@/assets/images/image_column/07.png").default,
      title: "江西农业大学“五育并举”提升人才培养“含金量”",
      link: "http://jyt.jiangxi.gov.cn/art/2021/6/8/art_25536_3390992.html",
    },
    {
      id: "08",
      url: require("@/assets/images/image_column/08.png").default,
      title: "江西农业大学：考研升学率再创历史新高 三分之一毕业生实现升学梦",
      link: "https://edu.jxnews.com.cn/system/2022/05/05/019623401.shtml",
    },
  ]

  return (
    <div className={styles.root}>
      <Swiper />

      <main className="inner">
        <div className="inner-top">
          <div className="carousel">
            <Button
              className={styles.prevBtn}
              type="text"
              icon={<LeftOutlined />}
              shape="circle"
              onClick={() => carouselRef.current.prev()}
            />
            <Button
              className={styles.nextBtn}
              type="text"
              icon={<RightOutlined />}
              shape="circle"
              onClick={() => carouselRef.current.next()}
            />
            <Carousel ref={carouselRef} autoplay effect="fade" dots={false}>
              {imageList.map((image) => {
                return (
                  <a href={image.link} key={image.id} target="_black">
                    <img src={image.url} alt="" />
                    <div className="title">{image.title}</div>
                  </a>
                )
              })}
            </Carousel>
          </div>
          <BriefCard />
          <AchievementCard list={reportList} title="成果报告" bgColor="#3c9cff" />
        </div>

        <div className="inner-bottom">
          <ApplyCard />
          <IconCard list={materialList} title="材料支撑" bgColor="#19be6b" />
        </div>
      </main>

      <div className="inner-link">
        <LinkPanel />
      </div>
    </div>
  )
}

export default Home
